<template>
	<div>
		<HomeHeader></HomeHeader>
		<HomeLeft :cur="15"></HomeLeft>
		<div id="main">
			<div id="web_con">
				<div class="web_wp">
					<div class="web_location">
						<div class="here_area">
							<strong>当前位置：</strong>菜单管理
						</div>
						<div class="here_btn">

						</div>
					</div>
					<!-- <div class="tabTitle">
						<ul class="clearfix">
							<li class="cur"><a href="javascript:;">地域分类</a></li>
							<li class=""><a href="javascript:;">地域分类</a></li>
						</ul>
						<div class="c"></div>
					</div> -->
					<div class="filter clearfix">
						<div class="aa">
							<div class="item">
								<span>名称：</span>
								<input type="text" placeholder="请输入" v-model="keywords" class="fill_text">
							</div>
							<div class="item">
								<button class="but_search" @click="Seach()">搜 索</button>
							</div>
						</div>
						<div class="bb">

							<navigator url="/pages/left/edit" hover-class="none" class="web_btn">

								<em class="iconfont icon-shdcsub-add"></em>添加
							</navigator>
							<a href="javascript:;" class="web_btn" @click="DeleteList()">
								<em class="iconfont icon-shdcsub-add-copy"></em>删除
							</a>
							<a href="javascript:;" class="web_btn btn_refresh" @click="Refresh()"><em
									class="iconfont icon-shdcshuaxin"></em>刷新</a>
						</div>
					</div>

					<div class="web_table">
						<table>
							<tr>
								<th class="tac" style="width: 60px;">选择</th>
								<th class="tac">名称</th>
								<th class="tac">排序</th>
								<th class="tac">操作</th>
							</tr>
							<tr v-for="(item,i) in listinfo" :key="i">
								<td class="tac">
									<el-checkbox v-model="item.checked"></el-checkbox>
								</td>
								<td class="tac">{{item.title}}</td>
								
								<td class="tac">{{item.sort}}</td>
								<td class="tac">

									<navigator :url="'/pages/left/edit?id=' + item.id" hover-class="none"
										class="editBtn" title="编辑">
									</navigator>

								</td>
							</tr>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import HomeHeader from '../components/Header.vue'
	import HomeLeft from '../components/Left.vue'
	export default {
		components: {
			HomeHeader,
			HomeLeft,

		},
		data() {
			return {
				page: 1,
				keywords: '',
				listinfo: [],
			}
		},
		onShow() {
			this.GetList();
		},
		methods: {


			GetList: function() {
				let that = this;
				uni.showLoading({
					title: '加载中...',
					mask: true
				});
				let _data = {
					name: that.keywords,
					page: that.page
				};
				that.common.http('GET', 'colauth/index', _data, function(res) {
					uni.hideLoading();
					console.log(res)
					that.listinfo = res.data
				});
			},

			ChengPage: function(e) {
				this.page = e;
				this.GetList();
			},

			Seach: function() {
				this.page = 1;
				this.GetList();
			},
			Refresh: function() {
				this.keywords = '';
				this.Seach();
			},

			GetChoseIds: function(list) {
				return list.filter(item => item.checked).map(item => item.id);
			},



			//删除
			DeleteList: function() {
				let that = this;
				var _ids = that.GetChoseIds(that.listinfo.data);
				if (_ids.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请先选择要删除项',
						duration: 2000
					});
				} else {
					that.$confirm('确定要删除吗?', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					}).then(() => {
						console.log(_ids)
						let _data = {
							ids: _ids.join(',')
						}
						that.common.http('POST', 'colauth/destroy', _data, function(res) {
							uni.hideLoading();
							that.listinfo = [];
							that.GetList();
						});
					}).catch(() => {

					});
				}
			},
		}
	}
</script>

<style>


</style>